@extends('layouts.header')
@section('title','成员管理')

@section('content')
    @foreach($groups as $group)
        @if( 0>= $group->users()->count())
            <div class="noSharePerson">
                <div><img src="{{ asset('icon/cehngyuan@2x.png') }}" alt=""></div>
                <div>还没有成员...</div>
            </div>
        @endif
        @foreach($group->users()->get() as $member)
            @if($member->id != $user->id)
                <div class="sharePerson myDevice">
                    <div class="list">
                        <div class="item">
                            <div class="itemTop">
                                <img src="{{ asset('images/100301249_wx@2x.png') }}" alt="">
                                <div class="deviceInfo">
                                    <h3 class="name">{{ $member->name }}</h3>
                                    <p>手机号：<span>{{ $member->phone }}</span></p>
                                    <p>添加时间：<span>{{ $member->created_at }}</span></p>
                                    <p>设备号：<span> {{ $group->device->getNumber() }} </span></p>

                                </div>
                            </div>
                            <div class="itemBottom" style="justify-content: center;">
                                <div style="border: none;">
                                    <a href="#" class="removeMember" data-id="{{$member->id}}" data-groupId="{{$group->id}}" data-name="{{ $member->name }}">
                                        <img src="{{ asset('icon/shanchu@2x.png') }}" alt="">
                                        <span>删除成员</span>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            @endif
        @endforeach
    @endforeach

    <div class="addSharePerson">
        <div class="kong"></div>
        <a href="{{route('user.create',['group_id'=>$groups->first()->id])}}" class="deviceStatus normal"
           style="border-radius:4px;">
            <div class="addSharePersonZ" id="addSharePerson">
                +添加成员
            </div>
        </a>
    </div>

@endsection
@push('js')
    <script>
        // member
        $(".removeMember").click(function () {
            var userId = $(this).attr("data-id");
            var groupId = $(this).attr("data-groupId")
            var name = $(this).attr("data-name");
            var $ele = $(this);
            mui.confirm("确认删除成员“" + name + "”吗?", "删除提示", ["确认", "取消"], function (res) {
                if (res.index == 0) {
                    $("#isShow").show();
                    $.ajax({
                        url: '{{ route('user.delete') }}',
                        type: "post",
                        data: {
                            '_token': '{{csrf_token()}}',
                            '_method': 'delete',
                            'user_id': userId,
                            'group_id': groupId
                        },
                        success: function (res) {
                            console.log(res);
                            if (res.code == 'success') {
                                mui.alert("该成员删除成功。");
                                $ele.parents('.myDevice').remove();
                            } else {
                                mui.alert("该成员删除失败,请重试。", "删除失败提示", "确认");
                            }
                            $("#isShow").hide();
                        },
                        error: function (err) {
                        }
                    });
                }
            });
        });


        $(".changeMember").click(function () {
            var this_ = this;
            var id = $(this).attr("data-id");
            var name = $(this).attr("data-name");
            mui.confirm("确认删除成员“" + name + "”并绑定新成员吗?", "成员变更", ["确认", "取消"], function (res) {
                if (res.index == 0) {
                    console.log("跳转到变更页");
                    // window.location.href = "?id=" +id;
                }
            });
        });
    </script>
@endpush
